<script setup lang="ts">
import { inject } from 'vue'
import { THEMEKEY } from './symbolkey'
const themeState = inject(THEMEKEY)
</script>
<template>
  <div class="container" :class="themeState">
    {{ themeState }}
  </div>
</template>
<style lang="scss" scoped>  
.container{
  width: 100px;
  height: 100px;
  border: 1px solid #ccc;
  &.light{
    background-color: white;
    color: #000;
  }
  &.dark{
    background-color: #000;
    color: white;
  }
}
</style>